import React from 'react'
import Component, { mapStateToProps, mapDispatchToProps } from '@components/Component'
import PropTypes from 'prop-types'
import { Table } from 'antd'
import { connect } from 'react-redux'
import { strToNum } from '@src/assets/js/tool'

function getColumn () {
  return [
    {
      title: '类别',
      dataIndex: 'type',
      key: 'type'
    },
    {
      title: '标的',
      dataIndex: 'dispute_amount',
      key: 'dispute_amount',
      render: (v, l) => {
        if (v === undefined) {
          return ''
        }
        const r = strToNum(v) + strToNum(l.dispute_amount_amend)
        return r.toFixed(2)
      }
    },
    {
      title: '行为',
      dataIndex: 'item_count',
      key: 'item_count',
      render: (v, l) => {
        if (v === undefined) {
          return ''
        }
        const r = strToNum(v) + strToNum(l.item_count_amend)
        return r
      }
    },
    {
      title: '受理费',
      dataIndex: 'fee_acceptance',
      key: 'fee_acceptance',
      render: (v, l) => {
        if (v === undefined) {
          return ''
        }
        const r = strToNum(v) + strToNum(l.fee_acceptance_amend)
        return r.toFixed(2)
      }
    },
    {
      title: '处理费',
      dataIndex: 'fee_processing',
      key: 'fee_processing',
      render: (v, l) => {
        if (v === undefined) {
          return ''
        }
        const r = strToNum(v) + strToNum(l.fee_processing_amend)
        return r.toFixed(2)
      }
    },
    {
      title: '合计',
      dataIndex: 'total',
      key: 'total',
      render: (v, l) => {
        v = strToNum(v)
        if (v) {
          return v.toFixed(2)
        }
      }
    }
  ]
}

class Main extends Component {
  state = {
    loading: false,
    dataSource: []
  }

  initFeeList () {
    this.setState({ loading: true })
    this.$get('/api/xapc/pay/getCasePay', { caseid: this.props.caseDetail.id })
      .then(res => {
        this.setState({ loading: false })
        if (res.data instanceof Array) {
          const list = res.data
          let total = 0
          list.forEach((li, i) => {
            let r = 0
            const keys = ['fee_acceptance', 'fee_acceptance_amend', 'fee_processing', 'fee_processing_amend']
            keys.forEach(k => {
              if (strToNum(li[k])) {
                r += strToNum(li[k])
              }
            })
            li.total = r
            total += li.total
          })
          list.push({ type: '合计', payid: 'total', total })
          this.setState({ dataSource: list })
        }
      })
      .catch(e => this.setState({ loading: false }))
  }

  componentDidMount () {
    this.initFeeList()
  }

  render () {
    return (
      <div style={{ padding: '0 24px 24px 24px' }}>
        <Table rowKey='payid' pagination={false} columns={getColumn()} loading={this.state.loading} dataSource={this.state.dataSource} />
      </div>
    )
  }
}

Main.proptypes = {
  caseDetail: PropTypes.object,
  userInfo: PropTypes.object,
  instance: PropTypes.object,
  formRef: PropTypes.object,
  dictionaries: PropTypes.object
}

Main.defaultProps = {
  caseDetail: {},
  userInfo: {},
  instance: {},
  formRef: {},
  dictionaries: {}
}

const mapState = mapStateToProps(function (state) {
  return {
    userInfo: state.basic.userInfo
  }
})

const mapDispatch = mapDispatchToProps(function (dispatch) {
  return {

  }
})

export default connect(mapState, mapDispatch)(Main)
